<template>
    <div>
<h2 v-if="flag">hello</h2>
<h2 v-else>world</h2>
<h2 v-if="Math.random() > 0.5">大于</h2>
<h2 v-else> 小于</h2>
<template v-if="ok">
    <h1>Vue</h1>
    <p>有条件渲染</p>
    </template>
    </div>
</template>

<script>
import { reactive, toRefs } from 'vue'

export default {
    setup () {
        const state = reactive({
            flag:false,
            ok:true
        })
    
        return {
            ...toRefs(state),
        }
    }
}
</script>

<style lang="scss" scoped>

</style>